<!-- popup modal login-->
<div class="modal fade" id="login-modal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h4 class="modal-title"><strong>Login to Applancer.co</strong></h4>
      </div>
      <div class="modal-body">
        <form action="<?php echo site_url('users/loginUpdate');?>" class="form-horizontal" role="form" id="login-popup-form" method="POST">
		  <div class="form-group">
		    <div class="col-sm-8 col-sm-offset-2 col-md-8 col-md-offset-2">
		      	<input type="text" class="form-control input-margin" id="inputfield" name="inputfield" placeholder="Email or Username" value="<?php if(get_cookie('inputfield')) echo get_cookie('inputfield');?>" >
                <div id="error_input_field"></div>
		    </div>
		  </div>
		  <div class="form-group">
		    <div class="col-sm-8 col-sm-offset-2 col-md-8 col-md-offset-2 remove_icon">
		      	<input type="password" class="form-control input-margin check_pwd" id="login-password" name="login-password" placeholder="Password" value="<?php if(get_cookie('pwd')) echo get_cookie('pwd');?>">

                <span id="show_error"></span>
                <span id="result_check_pwd"></span>
		    </div>
		  </div>
		  <div class="form-group">
		    <div class="col-sm-offset-2 col-sm-10 col-md-8 col-md-offset-2 text-center">
		      <div class="checkbox">
		        <label>
		          <input type="checkbox" style="padding-top:0px;margin-top:2px;" id="login-checkbox" name="login-checkbox"> Remember me
		        </label>
		        <label><a href="<?php echo site_url('users/forgotPassword');?>">Quên mật khẩu?</a></label>
		      </div>
		    </div>
		  </div>

		  <div class="form-group">
		    <div class="col-sm-8 col-sm-offset-2 col-md-8 col-md-offset-2">
		      	<button type="submit" class="btn btn-lg btn-primary col-sm-12 col-md-12">Sign In</button>
                <button style="margin-top: 20px;" type="button" class="btn-login-facebook btn btn-lg btn-primary col-sm-12 col-md-12">Facebook</button>
		    </div>
		  </div>

		</form>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- /.modal -->

<script type="text/javascript">
	$("#login-popup-form").validate({
		errorElement: "span", // contain the error msg in a span tag
		errorClass: 'help-block',
    onkeyup: false,
		errorPlacement: function (error, element) { // render error placement for each input type
            if (element.attr("type") == "radio" || element.attr("type") == "checkbox") { // for chosen elements, need to insert the error after the chosen container
                error.insertAfter($(element).closest('.form-group').children('div').children().last());
            } else if (element.attr("name") == "dd" || element.attr("name") == "mm" || element.attr("name") == "yyyy") {
                error.insertAfter($(element).closest('.form-group').children('div'));
            } else {
                error.insertAfter(element);
                // for other inputs, just perform default behavior
            }
        },
        highlight: function(element){
        	$(element).closest('.help-block').removeClass('valid');
        	// display OK icon
        	$(element).parent().parent().removeClass('has-success').addClass('has-error has-feedback').find('.symbol').removeClass('ok').addClass('required');
        	$(element).closest('.form-group').find(".glyphicon-ok").remove();
        	$(element).after("<span class='glyphicon glyphicon-remove form-control-feedback'></span>");
        },
        unhighlight: function (element) { // revert the change done by hightlight
            $(element).closest('.form-group').removeClass('has-error');

            
            // set error class to the control group
        },
        success: function(label,element){
        	label.addClass('help-block');
        	$(element).parent().parent().removeClass('has-error').addClass('has-success has-feedback').find('.symbol').removeClass('ok').addClass('required');
        	$(element).closest('.form-group').find(".glyphicon-remove").remove();
        	$(element).after("<span class='glyphicon glyphicon-ok form-control-feedback'></span>");
        },
		    rules:{
                "inputfield" : {
                    required : true,
                    remote: {
                      type : "POST",
                      url : "<?php echo site_url('users/checkUserInputField');?>",
                    },  
                    //minlength:5,
                },
                "login-password" : {
                    required : true,
                    //minlength : 8
                }
            },
             messages:{
                "inputfield":{
                    required : "<?php echo $this->lang->line('InputField')." ".$this->lang->line('required') ?>",
                    remote : "<?php echo $this->lang->line('InputField')." ".$this->lang->line('not_in_system'); ?>",
                    //minlength : "<?php echo $this->lang->line('InputField')." ".$this->lang->line('min_length'); ?>",
                },
                "login-password":{
                    required : "<?php echo $this->lang->line('Password')." ".$this->lang->line('required') ?>",
                   // minlength : "<?php echo $this->lang->line('Password')." ".$this->lang->line('min_length'); ?>",
                }
            }

	});


 //submit form
  $("#login-popup-form").submit(function(e){
    var i = 0;
       e.preventDefault();
       var url = '<?php echo site_url("users/loginUpdate");?>';
       var dataForm = new FormData(this);
       $.ajax({
           type :"POST",
           url : url,
           data : $( this ).serialize(),
           beforeSend: function(){
             
           },
           success: function(data){
               var res = $.parseJSON(data);
                 if(res.status == 'success'){
                    if(res.msg == "programmer")
                        window.location.href = BASE_URL+'/index.php/programmer/viewMyProjects';
                    else if(res.msg == "joblist")
                        window.location.href = res.redirect_url;
                    else if(res.msg == "invite-freelancer")
                        window.location.href = res.invite_freelancer_url;
                    else
                        window.location.href = BASE_URL+'/index.php/buyer/viewMyProjects';
                }else{
                    // sai mật khẩu
                    $(".check_pwd").parent().parent().addClass("has-error has-feedback").removeClass("has-success");
                    //$("#result_check_pwd").addClass('glyphicon glyphicon-remove form-control-feedback');
                    //$("#result_check_pwd").siblings().closest('.form-group').find("glyphicon-ok").remove();
                    $(".remove_icon").find(".glyphicon-ok").removeClass("glyphicon-ok").addClass("glyphicon-remove");
                    $("#show_error").html("<span class='help-block'>Mật khẩu không chính xác</span>");

                    //window.location.href = 'http://localhost/applancer_final/index.php/users/login';
                }
               /*if(res.status_email == 'email-not-exists'){
                    $("#error_input_field").show();                   
                    $("#error_input_field").html("<span class='error'>"+res.msg_email+"</span>");
                    $("#error_input_field").parent().parent().addClass("has-error has-feedback").removeClass("has-success");
                    $("#login-popup-form").find(".glyphicon-ok").removeClass("glyphicon-ok").addClass("glyphicon-remove");
                }else{
                    $("#error_input_field").hide();
                }

                if(res.status_user == 'user-not-exists'){
                    $("#error_input_field").show();
                    $("#error_input_field").html("<span class='error'>"+res.msg_user+"</span>");
                    $("#error_input_field").parent().parent().addClass("has-error has-feedback").removeClass("has-success");
                    $("#login-popup-form").find(".glyphicon-ok").removeClass("glyphicon-ok").addClass("glyphicon-remove");
                }else{
                    $("#error_input_field").hide();
                }

                if(res.status_pass == 'pass-not-exists'){
                    $("#error_input_pass").show();  
                    $("#error_input_pass").html("<span class='error'>"+res.msg_pass+"</span>");
                    $("#error_input_pass").parent().parent().addClass("has-error has-feedback").removeClass("has-success");
                    $("#login-popup-form").find(".glyphicon-ok").removeClass("glyphicon-ok").addClass("glyphicon-remove");
                    // if(res.status_email == 'email-not-exists'){                   
                    //     $("#error_input_field").html("<span class='error'>"+res.msg_email+"</span>");
                    //     $("#error_input_field").parent().parent().addClass("has-error has-feedback").removeClass("has-success");
                    //     $("#login-popup-form").find(".glyphicon-ok").removeClass("glyphicon-ok").addClass("glyphicon-remove");
                    // }
                }else{
                    $("#error_input_pass").hide();
                }
                   */





               //window.location.href = 'http://localhost/applancer_final/index/users/login';
               /*if(res.status == 'success'){
                   if(res.msg == "programmer")
                    {
                        window.location.reload(true);                        
                        window.location.href = BASE_URL+'index.php/programmer/viewMyProjects';
                    }                        
                   else{
                        window.location.reload(true);          
                        window.location.href = BASE_URL+'index.php/buyer/viewMyProjects';
                    }
               }else{
                   // sai mật khẩu
                   $(".check_pwd").parent().parent().addClass("has-error has-feedback").removeClass("has-success");
                   //$("#result_check_pwd").removeClass('glyphicon glyphicon-ok form-control-feedback');
                   $("#result_check_pwd").siblings().closest('.form-group').find("glyphicon-ok").remove();
                    $("#show_error").html("<span class='error'>Wrong username or password</span>");

                   //window.location.href = 'http://localhost/applancer_final/index.php/users/login';
               }*/
           },
           complete: function() {
          
            },
            timeout: 5000,

       });// end ajax
  });

</script>